<template>
	<view class="block-warp">
		<view class="block-title">{{ myAppsblockTitle }}</view>
		<view class="block-items">
			<view
				class="block-item"
				v-for="(item, index) in myAppsblockArray"
				:key="index"
				@click="jumpPages(index)"
			>
				<i class="certishare-icon">
					<span
						v-html="item.icon"
						class="block-item-icon"
					></span>
				</i>
				<span class="block-item-text">{{ item.text }}</span>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	name: 'block',
	data() {
		return {};
	},
	props: {
		myAppsblockArray: {
			type: Array
		},
		myAppsblockTitle: {
			type: String
		}
	},
	methods: {
		jumpPages(index) {
			switch (index) {
				case 0:
					uni.navigateTo({
						url: '/pages/mySeeting/mySeeting'
					});
					break;
			}
		}
	},
	mounted() {
		console.log(this.blockArray);
		console.log(this.blockTitle);
	}
};
</script>

<style lang="scss">
.block-warp {
	width: 90%;
	height: 138px;
	// background-color: rebeccapurple;
	margin: 30rpx auto;
	border-radius: 10px;
	box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1);
	.block-title {
		padding: 20rpx 20rpx 0 20rpx;
		font-family: 'Source Han Sans SC Bold';
	}
	.block-items {
		width: 100%;
		height: 94px;
		display: flex;
		align-items: center;
		justify-content: space-between;
		.block-item {
			width: 25%;
			// text-align: center;
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			.block-item-icon {
				font-size: 32px;
				font-weight: 700;
			}
			.block-item-text {
				font-size: 24rpx;
			}
		}
	}
}
</style>
